<template>
	<view class="wp">
		<nav-public :title="'团购礼包'" :background="'transparent'" :color="'white'" :isTransparent="true"></nav-public>
		<view class="fill_bg">
			<image class="bg" src="https://img.jinghushi.com/images/9/2024/08/XMIc1mwS2SEEa58EEa1mEswM11W98W.png" mode="widthFix"></image>
			<view class="content">
				<!-- <view class="l_tit">团长升级大礼包</view> -->
				<!-- <view class="l_tip">根据市场价值估算合计约256元</view> -->
				<view class="list">
					<view class="item" v-for="item in vipGoodsList" @click="$navTo('/pages/product/product?id='+item.id+'&isVip=1')">
						<image :src="item.thumb"></image>
						<view class="info">
							<view class="clamp2">{{item.title}}</view>
							<view class="price"><text>￥</text>{{Number(item.saleprice)}}</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<!-- <view class="xieyi">开通前请阅读<text @click="$navTo('https://bpapi.jinghushi.com/vip.html')">《VIP服务协议》</text></view> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userInfo: [],
				vipGoodsList: [],
				vipCurr: 0,
				mid: -1
			}
		},
		async onLoad(options) {
			if(options.mid){
				this.mid = options.mid;
			}
			// this.getUserInfo();
			if(!uni.getStorageSync('token')){
				this.getToken();
			}
			this.getVipGoodsList();
			// await this.$onLaunched;
		},
		methods: {
			getToken(){
				uni.login({
					provider: 'weixin',
					success:res=> {
						this.$axios('login/autologin','POST','member',{
							aid: uni.getStorageSync('appid').slice(-4),
							mid: this.mid,
							code: res.code
						}).then(res=>{
							if(res.data.code == 200){
								uni.setStorageSync('token', res.data.data);
								uni.setStorageSync('Jh_recotabshops', 1);
								this.getSharePath();
							}
						})
					}
				})
			},
			preview(index){
				uni.previewImage({
					urls: this.vipGoodsList[this.vipCurr].content,
					current: index
				})
			},
			changeVip(id){
				this.vipCurr = id;
			},
			toBuyReal(){
				if (!uni.getStorageSync('token')) {
					this.$refs.popup.open();
					return;
				}
				uni.navigateTo({
					// url: '/pages/order/createOrder?type=3&id='+this.vipGoodsList[this.vipCurr].id+'&optionid=0&total=1&isVip=1'
					url: '/pages/order/createOrder?type=2&id='+this.vipGoodsList[this.vipCurr].id+'&optionid=0&total=1&isGroupBuy=1&isVip=1'
				})
			},
			getUserInfo(){
				this.$axios('Center/main','POST','member').then(res=>{
					if(res.data.code == 200){
						this.userInfo = res.data.data;
					}
				})
			},
			getVipGoodsList(){
				this.$axios('home/vipgoodslist','POST','shop').then(res=>{
					if(res.data.code == 200){
						this.vipGoodsList = res.data.data.list;
					}
				})
			},
			navto(url) {
				if (url != "#" && url != "") {
					if (url.indexOf('http') == -1) {
						uni.navigateTo({
							url: url
						})
					} else {
						// #ifdef APP-PLUS || MP-WEIXIN
						uni.navigateTo({
							url: "../web/web-view?url=" + url
						})
						// #endif
						// #ifdef H5
						window.location.href = url
						// #endif
					}
				}
			},
			// getInfo() {
			// 	this.$axios('center/openVip', 'POST', 'member').then(res => {
			// 		if (res.data.code == 200) {
			// 			this.info = res.data.data;
			// 		}
			// 	})
			// }
		}
	}
</script>

<style lang="scss">
	page{
		background: #030303;
		padding-bottom: 100rpx;
	}
	.wp {
		// background: #1c1817;
		padding-bottom: 40rpx;
	}
	.fill_bg{
		position: relative;
		display: flex;
		.bg{
			width: 100%;
			position: absolute;
			top: 0;
			left: 0;
		}
		.vip_shop{
			position: absolute;
			left: 0;
			right: 0;
			margin: auto;
			text-align: center;
			bottom: 54rpx;
			image{
				width: 588rpx;
				display: block;
				margin: 0 auto;
			}
		}
	}
	.content{
		padding: 0 60rpx 40rpx;
		position: relative;
		top: 450rpx;
		.l_tit{
			font-size: 44rpx;
			font-weight: 600;
			color: #C3996F;
			background-image: linear-gradient(to bottom, #FFFFFF, #FFDFA3); /*设置渐变的方向从左到右 颜色从ff0000到ffff00*/
			background-clip: text;/*将设置的背景颜色限制在文字中*/
			-webkit-background-clip: text;
			-webkit-text-fill-color: transparent;/*给文字设置成透明*/
			text-align: center;
		}
		.l_tip{
			font-size: 24rpx;
			color: #DAB897;
			text-align: center;
			opacity: .4;
			line-height: 56rpx;
		}
		.list{
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
			margin-top: 40rpx;
			.item{
				margin-bottom: 26rpx;
				border-radius: 12rpx;
				width: 48%;
				overflow: hidden;
				background: #FDF6EC;
				image{
					width: 100%;
					height: 270rpx;
					display: block;
				}
				.info{
					padding: 20rpx;
					// background: #FDF6EC;
					font-weight: 600;
					color: #2C0F05;
					font-size: 24rpx;
					.price{
						font-size: 36rpx;
						margin-top: 6rpx;
						text{
							font-size: 20rpx;
							color: #310D03;
						}
					}
				}
			}
		}
	}

.xieyi{
	// background: #fbf8fe;
	color: #999;
	font-size: 24rpx;
	padding: 20rpx;
	text{
		// color: $bg-color;
		color: #d5b28f;
	}
}
</style>